<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Bride</title>
</head>
<body style="text-align:center">
<script type="text/javascript">
<!--
var ids = [
{% for photo in photos %}
"{{photo.photoId}}",
{% endfor %}
];
-->
</script>
<div style="width:100%;margin:0px;padding:0px;text-align:center;">
<div style="border:1px solid;position:relative;width:900px;height:600px;margin:auto;text-align:center;">
  <div style="vertical-align:middle;">
  <img id="mainimage" src="/img/bride/bg06.png">
  </div>
  <div style="background:url('/img/bride/bg06.png') repeat scroll 0 0 transparent;position:absolute;top:0;left:0;width:50%;height:100%;">
    <a style="cursor:url('/img/bride/bg11.cur'), auto;display:block;width:100%;height:100%;" onclick="prephoto()"></a>
  </div>
  <div style="background:url('/img/bride/bg06.png') repeat scroll 0 0 transparent;position:absolute;top:0;right:0;width:50%;height:100%;">
    <a style="cursor:url('/img/bride/bg12.cur'), auto;display:block;width:100%;height:100%;" onclick="nextphoto()"></a>
  </div>
</div>
<div style="position:relative;width:900px;height:60px;margin:auto;text-align:center;">
<a id="rawlink" target="_blank">原图</a>
</div>
<!--<div style="position:relative;width:100%;height:160px;margin:auto;text-align:center;">
    <ul id="tblist">
    </ul>
</div>
-->
</div>

<div id="authblock" style="z-Index:0;position:fixed;+position:absolute;top:0px;left:0px;width:100%;height:100%;margin:0px;padding:0px;background:#000;filter:alpha(opacity=50);opacity:0.5;">
</div>
<div id="authbox" style="position:fixed;+position:absolute;top:0px;left:0px;width:100%;background:#FFF;margin-right:auto;margin-left:auto;text-align:center;">
密码：<input id="pwd" type="text" name="pwd">
<input type="button" onclick="auth();" value="确定">
</div>

</body>
<script type="text/javascript">
<!--
function preload(sources)
{
  var images = [];
  var length = ids.length;
  for (var i = 0; i < length; ++i) {
    images[i] = new Image();
    images[i].src = sources[i];
  }
}

function getsources(ids)
{
    var sources = [];
    var length = ids.length;
    for(var i=0;i<length; ++i){
        sources[i] = "/bride/show/" + ids[i] + ".jpg"
    }
    return sources;
}

function getrawurls(ids)
{
    var rawurls = [];
    var length = ids.length;
    for(var i=0;i<length; ++i){
        rawurls[i] = "/bride/raw/" + ids[i] + ".jpg"
    }
    return rawurls;

}

function prephoto(){
    curid--;
    if(curid<0){
        curid = ids.length-1;
    }
    if(ids[curid] == undefined){
        prephoto();
        return;
    }
    mainimage.src = sources[curid];
    rawlink.href = rawurls[curid];
}

function nextphoto(){
    curid++;
    if(curid>=ids.length){
        curid = 0;
    }
    if(ids[curid] == undefined){
        nextphoto();
        return;
    }
    mainimage.src = sources[curid];
    rawlink.href = rawurls[curid];
}

sources = getsources(ids);
rawurls = getrawurls(ids);

var mainimage = document.getElementById("mainimage");
var rawlink = document.getElementById("rawlink");
var tblist = document.getElementById("tblist");

var xmlHttp;
function auth()
{
    xmlHttp = GetXmlHttpObject(
        function(){
            try{
                if (xmlHttp.readyState == 4 ||
                    xmlHttp.readyState == 'complete')
                {
                    var response = xmlHttp.responseText;
                    if (response == '1') {
                        show();
                    }
                }
            }catch(e){}
        }
    );
    url = '/bride/auth/' + document.getElementById('pwd').value;
    xmlHttp.open('GET', url, true);
    xmlHttp.send(null);
}
function GetXmlHttpObject(handler){
    var objXmlHttp = null;
    if (window.ActiveXObject) {
        objXmlHttp = GetMSXmlHttp();
        if (objXmlHttp != null) {
            objXmlHttp.onreadystatechange = handler;
        }
    }
    else {
        // Mozilla | Netscape|Safari
        objXmlHttp = new XMLHttpRequest();
        if (objXmlHttp != null) {
            objXmlHttp.onload = handler;
            objXmlHttp.onerror = handler;
        }
    }
    return objXmlHttp;
}
function GetMSXmlHttp(){
    var xmlHttp = null;
    var clsids = ["Msxml2.XMLHTTP.6.0","Msxml2.XMLHTTP.5.0",
                  "Msxml2.XMLHTTP.4.0","Msxml2.XMLHTTP.3.0",
                  "Msxml2.XMLHTTP.2.6","Microsoft.XMLHTTP.1.0",
                  "Microsoft.XMLHTTP.1","Microsoft.XMLHTTP"];
    for(var i=0; i<clsids.length && xmlHttp == null; i++) {
        xmlHttp = CreateXmlHttp(clsids[i]);
    }
    return xmlHttp;
}
function CreateXmlHttp(clsid) {
    var xmlHttp = null;
    try {
        xmlHttp = new ActiveXObject(clsid);
        lastclsid = clsid;
        return xmlHttp;
    }
    catch(e) {}
}

function show()
{
    document.getElementById("authbox").style.display = 'none';
    document.getElementById("authblock").style.display = 'none';
    curid = 1;
    prephoto();
    
    preload(sources);
}

// for keyboard shortcut
document.onkeydown=kbd_shortcut;
function kbd_shortcut(){
  var event=document.all?window.event:arguments[0];
  if (event.keyCode==37) prephoto();
  if (event.keyCode==39) nextphoto();
  }
-->
</script>
</html>
